<!DOCTYPE html>
<html class="loading" lang="en" data-textdirection="ltr">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
	<meta name="author" content="PIXINVENT">
	<title>999后台管理系统</title>
	<link rel="stylesheet" type="text/css" href="app-assets/css/vendors.css">
	<link rel="stylesheet" type="text/css" href="app-assets/css/vertical-menu.css">
	<link rel="stylesheet" type="text/css" href="app-assets/css/bootstrap-extended.css">
	<script src="app-assets/js/Dream.js"></script>
</head>
<body>
<div class="content-wrapper">
	<div class="content-header ">
		<div class="content-header-left mb-2">
			<h3 class="content-header-title mb-0">供应商管理</h3>
		</div>
	</div>
	<div class="card">
		<div class="card-content">
			<div class="card-body">
				<div class="searchbox">
					<div class="form-inline">
						<div class="form-group">
							<input type="text" class="form-control" id="select-supplierName" placeholder="供应商名称">
						</div>
						<div class="form-group">
							<button type="submit" class="btn btn-primary" onclick="selects()">查询</button>
						</div>
					</div>
				</div>
				<div class="funcbtn clearfix">
					<div class="pull-left"><a class="btn btn-info" href="#" data-toggle="modal" data-target="#myModal2"
											  onclick="insertEm()">添加合同</a>
					</div>
				</div>
				<div class="tablebox1">
					<table class="table">
						<thead>
						<tr>
							<th>ID</th>
							<th>供应商</th>
							<th>开始日期</th>
							<th>结束日期</th>
							<th>状态</th>
							<th>操作</th>
						</tr>
						</thead>
						<tbody id="showT">
						<tr>
							TODO
						</tr>

						</tbody>
					</table>

					<div class="page clearfix">
						<div class="pull-left">共 <span id="total"></span> 条记录 第 <span id="pageNum"></span> / <span
								id="pages"></span> 页
						</div>
						<div class="pull-right">

							<nav aria-label="..." class="pull-left">
								<ul class="pagination" id="pageTo">

								</ul>
							</nav>
							<div class="pull-left p-l-20"><a class="" href="#" onclick="pageTo()">跳至</a><input
									type="text" value="" class="form-control" id="pageNumber">页
							</div>
						</div>

					</div>

				</div>
			</div>
		</div>
	</div>
</div>

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
				</button>
				<h4 class="modal-title">供应商信息</h4>
			</div>
			<div class="modal-body">
				<div class="form1 form2">
					<ul class="row" id="upMod">
						<li class="  col-xs-20"><span>ID：</span>
							<input type="text" id="upd-supplierId" class="form-control">
						</li>
						<li class="col-xs-20"><span>供应商名称：</span>
							<input type="text" id="upd-supplierName" class="form-control">
						</li>

						<li class="col-xs-20"><span>联系人姓名：</span>
							<input type="text" id="upd-contactName" class="form-control">
						</li>

						<li class="col-xs-20"><span>联系电话：</span>
							<input type="text" id="upd-contactPhone" class="form-control">
						</li>

						<li class="col-xs-20"><span>邮箱：</span>
							<input type="text" id="upd-email" class="form-control">
						</li>

						<li class="col-xs-20"><span>地址：</span>
							<input type="text" id="upd-address" class="form-control">
						</li>

					</ul>
				</div>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
				<button type="button" class="btn btn-primary" id="nToE" onclick="nToE()">保存</button>
			</div>
		</div>

	</div>
</div>
<div class="modal fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
				</button>
				<h4 class="modal-title">供应商信息</h4>
			</div>
			<div class="modal-body">
				<div class="form1 form2">
					<ul class="row" id="inMod">
						<li class="col-xs-20"><span>供应商名称：</span>
							<input type="text" id="in-supplierName" class="form-control">
						</li>

						<li class="col-xs-20"><span>联系人姓名：</span>
							<input type="text" id="in-contactName" class="form-control">
						</li>

						<li class="col-xs-20"><span>联系电话：</span>
							<input type="text" id="in-contactPhone" class="form-control">
						</li>

						<li class="col-xs-20"><span>邮箱：</span>
							<input type="text" id="in-email" class="form-control">
						</li>

						<li class="col-xs-20"><span>地址：</span>
							<input type="text" id="in-address" class="form-control">
						</li>
						<li class="col-xs-20"><span>密码：</span>
							<input type="text" id="in-password" class="form-control">
						</li>


					</ul>
				</div>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
				<button type="button" class="btn btn-primary" id="nToEm" onclick="nToEm()">保存</button>
			</div>
		</div>

	</div>
</div>

<div class="modal fade" id="myModal1" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
				</button>
				<h4 class="modal-title">修改供应商密码</h4>
			</div>
			<div class="modal-body">
				<div class="form1 form2">
					<ul class="row">
						<li class="col-xs-20"><span>ID：</span>
							<input type="text" class="form-control" value="" disabled id="upd-password-id">
						</li>

						<li class="col-xs-20"><span>用户密码：</span>
							<input type="text" class="form-control" value="" id="upd-password-pwd">
						</li>
					</ul>
				</div>
			</div>
			<div class="modal-footer">
				<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
				<button type="button" class="btn btn-primary" onclick="updatePasswordBt()">保存</button>
			</div>
		</div>
	</div>
</div>


<script src="app-assets/js/vendors.min.js" type="text/javascript"></script>
<script src="app-assets/js/app-menu.js" type="text/javascript"></script>
<script src="app-assets/js/app.js" type="text/javascript"></script>
<script src="app-assets/js/echarts.min.js" type="text/javascript"></script>
<script>
	$(document).ready(function () {
		$(".ewm").click(function () {
			$(this).toggleClass("active")
		});
		selectAll($('#select-supplierName').val(), $('#select-contactName').val(), $('#select-contactPhone').val(), $('#select-email').val(), $('#select-address').val(), 1)
	});

	function selectAll(supplierName, contactName, contactPhone, email, address, pageNum) {
		$.ajax({
			'url': 'http://localhost:8080/suppliers',
			'type': 'get',
			'dataType': 'json',
			'data': {supplierName, contactName, contactPhone, email, address, pageNum},
			'success': selectAllSuccess
		})
	}

	function selects() {
		selectAll($('#select-supplierName').val(), $('#select-contactName').val(), $('#select-contactPhone').val(), $('#select-email').val(), $('#select-address').val(), 1)
	}

	function selectAllSuccess(data) {
		$('#showT tr').remove()

		data.data.list.forEach(dd => {
			let status = dd.deleteAt == null ? '<span class="text-primary">正常</span>' : '<span class="text-danger">删除</span>'
			$('#showT').append(`<tr>
                    <td>${dd.supplierId}</td>
                    <td>${dd.supplierName}</td>
                    <td>${dd.contactName}</td>
                    <td>${dd.contactPhone}</td>
                    <td><span class="text-success">${dd.email}</span></td>
                    <td>${dd.address}</td>
                    <td>` + status + `</td>
                    <td>
                        <div class="setbox">
                            <p>选择操作</p>
                            <div class="setlist">
                                <a href="转让.html" onclick="update(this)" data-toggle="modal" data-target="#myModal">修改</a>
                                <a href="修改设备.html" onclick="updatePassword(this)" data-toggle="modal" data-target="#myModal1">改密</a>
                                <a href="#" onclick="deleteEm(this)">删除</a>
                            </div>
                        </div>
                    </td>
                </tr>`)
		})
		$('#total').html(data.data.total)
		$('#pageNum').html(data.data.pageNum)
		$('#pages').html(data.data.pages)
		$('#pageSize').html(data.data.pageSize)
		let upP = ''
		if (data.data.pageNum == 1) {
			upP = 'disabled'
		}
		let neP = ''
		if (data.data.pageNum == data.data.pages) {
			neP = 'disabled'
		}
		let pageTo = ''
		pageTo += `<li class="` + upP + `" onclick="upPage()"><a href="#" aria-label="Previous"><span aria-hidden="true">«</span></a></li>`
		for (let i = 1; i <= data.data.pages; i++) {
			if (i == data.data.pageNum) {
				pageTo += `<li class="active"><a href="#">${i} <span class="sr-only">(current)</span></a></li>`
			} else {
				pageTo += `<li><a href="#">${i}</a></li>`
			}
		}
		pageTo += `<li class="` + neP + `" onclick="nePage()"><a href="#" aria-label="Next"><span aria-hidden="true">»</span></a></li>`
		$('#pageTo').html(pageTo)

		$('#pageTo a').click(function () {
			let pageNum = $(this).html()
			selectAll($('#select-supplierName').val(), $('#select-contactName').val(), $('#select-contactPhone').val(), $('#select-email').val(), $('#select-address').val(), pageNum)
		})
	}

	function upPage() {
		let pageNum = $('#pageNum').html()
		pageNum--
		selectAll($('#select-supplierName').val(), $('#select-contactName').val(), $('#select-contactPhone').val(), $('#select-email').val(), $('#select-address').val(), pageNum)
	}

	function nePage() {
		let pageNum = $('#pageNum').html()
		pageNum++
		selectAll($('#select-supplierName').val(), $('#select-contactName').val(), $('#select-contactPhone').val(), $('#select-email').val(), $('#select-address').val(), pageNum)
	}

	function pageTo() {
		let pageNum = $('#pageNumber').val()
		selectAll($('#select-supplierName').val(), $('#select-contactName').val(), $('#select-contactPhone').val(), $('#select-email').val(), $('#select-address').val(), pageNum)
	}

	//修改
	function update(e) {
		let id = $(e).parent().parent().parent().parent();
		let supplierName = id.find('td').eq(1).html();
		let contactName = id.find('td').eq(2).html();
		let contactPhone = id.find('td').eq(3).html();
		let email = id.find('td').eq(4).html().replace('<span class="text-success">', '').replace('</span>', '');
		let address = id.find('td').eq(5).html();

		// 如果员工 ID 与 sessionStorage 中的员工 ID 不同，设置输入框的值并禁用 ID 输入框
		$('#upd-supplierName').val(supplierName).attr('disabled', false)
		$('#upd-contactName').val(contactName).attr('disabled', false)
		$('#upd-contactPhone').val(contactPhone).attr('disabled', false)
		$('#upd-email').val(email).attr('disabled', false)
		$('#upd-address').val(address).attr('disabled', false)
		$('#upd-supplierId').val(id.find('td').eq(0).html()).attr('disabled', true);
		$('#nToE').attr('disabled', false)

	}

	function nToE() {
		let supplierId = $('#upd-supplierId').val()
		let supplierName = $('#upd-supplierName').val()
		let contactName = $('#upd-contactName').val()
		let contactPhone = $('#upd-contactPhone').val()
		let email = $('#upd-email').val()
		let address = $('#upd-address').val()


		let updatedBy = sessionStorage.getItem("loginName")

		$.ajax({
			'url': 'http://localhost:8080/suppliers',
			'type': 'put',
			'dataType': 'json',
			'contentType': 'application/json',
			'data': JSON.stringify({
				supplierId,
				supplierName,
				contactName,
				contactPhone,
				email,
				address,
				updatedBy
			}),
			'success': nToESuccess
		})
	}

	function nToESuccess(data) {
		if (data.code == 200) {
			Dreamer.success('修改成功', 1000);
			$('#myModal').modal('hide')
			$('#upd-supplierId').val('')
			$('#upd-supplierName').val('')
			$('#upd-contactName').val('')
			$('#upd-contactPhone').val('')
			$('#upd-email').val('')
			$('#upd-address').val('')
			selectAll($('#select-supplierName').val(), $('#select-contactName').val(), $('#select-contactPhone').val(), $('#select-email').val(), $('#select-address').val(), 1)
		} else {
			Dreamer.error('修改失败', 1000);
		}
	}

	// 密码修改
	function updatePassword(e) {
		//获取ID
		let id = $(e).parent().parent().parent().parent();
		$('#upd-password-id').val(id.find('td').eq(0).html())
	}

	function updatePasswordBt() {
		let supplierId = $('#upd-password-id').val()
		let password = $('#upd-password-pwd').val()
		let updatedBy = sessionStorage.getItem("loginName")
		$.ajax({
			'url': 'http://localhost:8080/suppliers',
			'type': 'put',
			'dataType': 'json',
			'contentType': 'application/json',
			'data': JSON.stringify({supplierId, password, updatedBy}),
			'success': updatePasswordSuccess
		})
	}

	function updatePasswordSuccess(data) {
		if (data.code == 200) {
			Dreamer.success('修改成功', 1000);
			$('#myModal1').modal('hide')
			$('#upd-password-pwd').val('')
			selectAll($('#select-supplierName').val(), $('#select-contactName').val(), $('#select-contactPhone').val(), $('#select-email').val(), $('#select-address').val(), 1)
		} else {
			Dreamer.error('修改失败', 1000);
		}
	}

	// 新增
	function insertEm() {
		$('#in-supplierName').val('')
		$('#in-contactName').val('')
		$('#in-contactPhone').val('')
		$('#in-email').val('')
		$('#in-address').val('')
		$('#in-password').val('')
	}

	function nToEm() {

		let supplierName = $('#in-supplierName').val()
		let contactName = $('#in-contactName').val()
		let contactPhone = $('#in-contactPhone').val()
		let email = $('#in-email').val()
		let address = $('#in-address').val()
		let password = $('#in-password').val()
		let createdBy = sessionStorage.getItem("loginName")
		let updatedBy = sessionStorage.getItem("loginName")

		$.ajax({
			'url': 'http://localhost:8080/suppliers',
			'type': 'post',
			'dataType': 'json',
			'contentType': 'application/json',
			'data': JSON.stringify({
				supplierName, contactName, contactPhone, email, address, password, createdBy, updatedBy
			}),
			'success': nToEmSuccess
		})
	}

	function nToEmSuccess(data) {
		if (data.code == 200) {
			Dreamer.success('新增成功', 1000);
			$('#myModal2').modal('hide')
			$('#in-supplierName').val('')
			$('#in-contactName').val('')
			$('#in-contactPhone').val('')
			$('#in-email').val('')
			$('#in-address').val('')
			$('#in-password').val('')
			selectAll($('#select-supplierName').val(), $('#select-contactName').val(), $('#select-contactPhone').val(), $('#select-email').val(), $('#select-address').val(), 1)
		} else {
			Dreamer.error('新增失败', 1000);
		}
	}

	function deleteEm(e) {
		//获取ID
		let employeeId = $(e).parent().parent().parent().parent().find('td').eq(0).html()
		$.ajax({
			'url': 'http://localhost:8080/suppliers/' + employeeId,
			'type': 'delete',
			'dataType': 'json',
			'success': deleteEmSuccess
		})
	}

	function deleteEmSuccess(data) {
		if (data.code == 200) {
			Dreamer.success('删除成功', 1000);
			selectAll($('#select-supplierName').val(), $('#select-contactName').val(), $('#select-contactPhone').val(), $('#select-email').val(), $('#select-address').val(), 1)
		} else {
			Dreamer.error('删除失败', 1000);
		}
	}

</script>
</body>
</html>